
    initDialogVisible:false,
    percentage:0,
    IntervalFlag:null,
    progressStatus:null
    forwardFlag:false,
    backFlag:false,
    leftFlag:false,
    rightFlag:false,
    forward:'',back:'',left:'',right:'',
    
    this.keyboardControll();

    <el-button type="primary" @click="renamePosition" :disabled="canvasManager.editStatus">重命名点</el-button>
    <el-button type="danger" @click="removePosition" :disabled="canvasManager.editStatus">删除定点</el-button>
    <el-divider content-position="left" >选择起点-选择符合小车当前位置的点作为起点</el-divider> 
    <el-button type="success" @click="localInitialize" :disabled="canvasManager.editStatus">开始初始化</el-button>

    <el-divider>任务回馈</el-divider>
    <el-button type="primary" @click="checkTask" >检查任务</el-button>
    <el-button type="primary" @click="comeBack" :disabled="canvasManager.editStatus">返回起点</el-button>

  <!-- <el-upload
              class="upload-demo"
              ref="upload"
              :limit = "1"
              :action = uploadurl
              :before-upload="beforeUpload"
              :auto-upload="false">
              <el-button slot="trigger" type="primary">选取文件</el-button>
              <el-button style="margin-left: 10px;"  type="success" @click="submitUpload">上传到服务器</el-button>
         </el-upload>   -->
         
    getTabelInfo(){
           let _that = this
           let promise = new Promise(function(resolve,reject){
            $.ajax({
                url:'http://192.168.137.1/nuc/queryAllFinishedTasks',
                method:'get',
                datatype:'json',
                success:(res) =>{
                    resolve(res)
                    _that.loading = false
                    _that.tableData = res
                },
                error:(err)=>{
                    reject(err)
                }
            });
        });
        //推荐使用箭头函数简写成,极大提升了代码的简洁性和可读性
        // promise.then(res => res.data).then(data => data.result).then(result => console.log(result));        
        },

    async showBattery(){
        try{
          const res=await gsApi.showBattery()
          if(res.data.msg=="successed"){
            if(res.data.data.charger==0){
              this.$message.success('电量：' + res.data.data.battery + <br/> + "未充电")
            }else{
              this.$message.success('电量：' + res.data.data.battery + <br/> + "充电中")
            }
          }else{
            this.$message.error("显示电量失败，详见控制台")
          }
        }catch(err){
          console.log(err);
          this.$message.error("显示电量失败，详见控制台")
        }
      },

       async checkTask(){
         try {
           const res = await gsApi.checkTask();
           if(res.data.data===true){
             this.$message.success('任务完成');
           }else{
            this.$message.info('任务进行中');
           }
         }catch (err) {
           console.log(err);
           this.$message.error('网络异常')
         }
      },

            //键盘方向键控制小车移动
      keyboardControll(){
        document.onkeydown=(e)=>{
          // console.log("keydown执行了")
          let key = e.keyCode;
          //当向上键被按下时
          if (key == 38) {
            if(this.forwardFlag){
              return
            }else{
              this.walkForward();
              this.forwardFlag=true;
            }
          }
          //当向下键被按下时
          if (key == 40) {
              if(this.backFlag){
                return
              }else{
                this.walkBack();
                this.backFlag=true;
              }
          }
          //当向左键被按下时
          if (key == 37) {
              if(this.leftFlag){
                return
              }else{
                this.turnLeft();
                this.leftFlag=true;
              }
          } 
          //当向右键被按下时
          if (key == 39) {
            if(this.rightFlag){
              return
            }else{
              this.turnRight();
              this.rightFlag=true;
            }
          }
        }
        document.onkeyup=(e)=>{
          let key = e.keyCode;
          switch(key){
            case 38:
              console.log("keyup执行了")
              this.forwardFlag=false;
              clearInterval(this.forward);
              break;
            case 40:
              this.backFlag=false;
              clearInterval(this.back);
              break;
            case 37:
              this.leftFlag=false;
              clearInterval(this.left);
              break;
            case 39:
              this.rightFlag=false;
              clearInterval(this.right);
              break;
          }
        }
      },

       async walkForward(){
        this.forward = setInterval(() => {
          gsApi.walkForward();
          // console.log('向前');
        }, 200);
      },
      /**
       * 向后走
       */
      async walkBack(){
        this.back = setInterval(() => {
          gsApi.walkBack();
          // console.log('向后');
        }, 200);
      },
      /**
       * 停止
       */
      async walkStop(){
        const res = gsApi.walkStop();
        console.log(res);
      },
      async turnLeft(){
        this.left = setInterval(() => {
          gsApi.turnLeft();
          // console.log('左转');
        }, 200);
      },
      async turnRight(){
        this.right = setInterval(() => {
          gsApi.turnRight();
          // console.log('右转');
        }, 200);
      },

     renamePosition(){//修改名称
        const mapName=this.dataManager.current.mapName
        const originPosition = this.dataManager.current.positionName;
        if(originPosition ==''){
            this.$message.info('请选择定点')
            return
          }
        this.$prompt('请输入新名称', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
        }).then(async({ value }) => {
          try {
              const res = await gsApi.renamePosition(mapName,originPosition,value)
              if(res.data.msg==='successed'){
                this.$message.success('修改成功')
                  await this.dataManager.loadPositions(mapName);
              }else{
                this.$message.error(res.data.msg);
              }
            }catch (err) {
              console.log(err);
              this.$message.error('网络异常')
            }
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });       
        });
      },

      /**
       * 删除定点数据
       */
      removePosition(){
            const positionName=this.dataManager.current.positionName;
            const mapName=this.dataManager.current.mapName;
            if(positionName == ''){
              this.$message.info('请选择定点')
              return
            }
          this.$confirm('此操作将永久删除该点, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              }).then(async() => {
                try{
                  const res = await gsApi.deletePosition(mapName, positionName)
                  console.log(res)
                  if(res.data.msg==='successed'){
                    this.$message.success('定点' + positionName + '删除成功')
                    // 删除成功后，重新加载手绘路径
                    await this.dataManager.loadPositions(mapName);
                    // 取消选中路径
                    this.dataManager.current.positionName = ''
                    // 清理canvas 轨迹
                    this.canvasManager.clearObject();
                  }else{
                    this.$message.error("删除定点失败，详见控制台")
                  }
                }catch (err) {
                  console.log(err);
                  this.$message.error('删除失败，详见控制台')
                }
              }).catch(() => {
                  this.$message({
                    type: 'info',
                    message: '已取消删除'
                  });          
                });     
          },

        async initialize(){
             this.dataManager.location();
             const loadPoint=this.dataManager.current.positionName;
             if(loadPoint== null){
               this.$message.error('当前位置为空')
               return
             }
             try {
               const res = await gsApi.initialize(this.dataManager.current.mapName,loadPoint);
              //  console.log(res)
               if(res.data.msg==='successed'){
                 this.$message.success('初始化启动')
               }else{
                this.$message.error(res.data.msg);
               }
             }catch (err) {
               console.log(err);
               this.$message.error('网络异常')
             }
          },

          async checkInitialize(){
             try {
               const res = await gsApi.checkInitialize();
               if(res.data.data=='true'){
                 this.$message.success('初始化已完成')
               }else{
                this.$message.error("初始化未完成");
               }
             }catch (err) {
               console.log(err);
               this.$message.error('网络异常')
             }
          },

            async comeBack(){
        const mapName=this.dataManager.current.mapName;
         try {
           const res = await gsApi.startNavigate(mapName,'Origin');
           if(res.data.msg==='successed'){
             this.$message.success(`正在返回`)
           }else{
            this.$message.error(res.data.msg);
           }
         }catch (err) {
           console.log(err);
           this.$message.error('网络异常')
         }
      },
        
        async checkTask(){
         try {
           const res = await gsApi.checkTask();
           if(res.data.data===true){
             this.$message.success('任务完成');
           }else{
            this.$message.info('任务进行中');
           }
         }catch (err) {
           console.log(err);
           this.$message.error('网络异常')
         }
      },
 })
